<HTML>
<HEAD>
<TITLE>JavaScript Source Code 3000:  Page Details:  Image Manipulator</TITLE>
<META HTTP-EQUIV="JavaScript Source Code 3000" CONTENT = "no-cache">
<META NAME="date" CONTENT="2000-09-09">
<META NAME="channel" CONTENT="Web Developer">
<META NAME="author" CONTENT="Ronnie T. Moore">
<META NAME="section" CONTENT="Page Details">
<META NAME="description" CONTENT="Displays an online image or local image from your computer under various width and height manipulations that you enter.  Useful for determining the best size for an image on your site without all the work.  Nice!">

<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Ronnie T. Moore -->
<!-- Web Site:  JavaScript Source Code 3000 -->

<!-- Uses parts of Anders Jennerberg's (anders@katedral.se) code at  -->  
<!-- http://page-details.javascriptsource.com/thumbnail-viewer.html  -->




<!-- Begin
function ViewImage(form) {
ix = form.width.value;
iy = form.height.value;
ifile = form.url.value;
NS = (document.layers) ? 1 : 0;
localurl = ifile.indexOf('http://') == -1;
if (NS && localurl) ifile = "file:///" + ifile;
var win;
var sWidth;
var sHeight;
win = window.open("","","width="+ix+",height="+iy+",menubar=no,toolbar=no,top=100,left=100");
if (NS) {
sWidth = win.innerWidth;
sHeight = win.innerHeight;
} else {
sWidth = win.document.body.clientWidth;
sHeight = win.document.body.clientHeight;
}
win.document.open();
win.document.write("<html><head></head><body onBlur=this.close();>");
win.document.write('<div style="position:absolute;width:'+ix+'px;height:'+iy+'px;left:0px;top:0px">');
win.document.write("<img src="+ifile+" width=" + ix + " height=" + iy + "></div></body></html>");
win.document.close();
}
//  End -->
</script>
</HEAD>

<BODY BGCOLOR=#ffffff vlink=#0000ff>

<BR>
<center>
<table width=600 cellpadding=0 cellspacing=10>
<tr>
<td width=468 align=center>

    
    
</td>
<td width=120 align=center>
    
</td>
</tr>
</table>
<BR>
<BR>
<basefont size=3>
<FONT SIZE="+2" FACE="Helvetica,Arial">
<A HREF="../index.htm" /" TARGET="_top"><FONT COLOR="#0000FF"><b>Home</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<A HREF="index.htm" /page-details/"><font color="#FF0000"><b>Page Details</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<FONT COLOR="#006666"><b>Image Manipulator</b></font></font>
<BR>
<BR>
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td><font FACE="helvetica,arial,geneva">
<br>
<br>
<!-- Description --><!--content_start-->
Displays an online image or local image from your computer under various width and height manipulations that you enter.  Useful for determining the best size for an image on your site without all the work.  Nice!
<hr>
</td></tr>
</table>
<!-- Demonstration -->
<center>

<pre>
Type the web address (starting with http://) of the
image you would like to view, or browse your computer
for an image by clicking the <b>Browse...</b> button.</b>
</pre>

<p>
<form name=imageform>
<input name=url type=file size=40>
<p>
Height: <input name=height type=text value="200" size=3>
Width:  <input name=width type=text value="150" size=3>
<p>
<input type=button value="View Image" onClick="ViewImage(this.form);">

<P>
<P>
<a name="source">
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td BGCOLOR=yellow><font FACE="helvetica,arial,geneva"><b>JavaScript Source Code 3000:  Page Details:  Image Manipulator</b>
<p>Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s).  The script is yours!!!
<br><br></font></td></tr>
<tr><td BGCOLOR=yellow ALIGN=CENTER>
<form NAME="copy">

<DIV align="center">
<input type=button value="Highlight All" onClick="javascript:this.form.txt.focus();this.form.txt.select();">&nbsp;&nbsp;&nbsp;&nbsp;
<INPUT TYPE="text" NAME="total" VALUE="Script Size:  2.07 KB" size=24>
</DIV>

<textarea NAME="txt" ROWS=20 COLS=75 WRAP=VIRTUAL>

&lt;!-- TWO STEPS TO INSTALL IMAGE MANIPULATOR:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  --&gt;

&lt;!-- STEP ONE: Paste this code into the HEAD of your HTML document  --&gt;

&lt;HEAD&gt;

&lt;SCRIPT LANGUAGE="JavaScript"&gt;
&lt;!-- Original:  Ronnie T. Moore --&gt;
&lt;!-- Web Site:  JavaScript Source Code 3000 --&gt;

&lt;!-- Uses parts of Anders Jennerberg's (anders@katedral.se) code at  --&gt;  
&lt;!-- http://page-details.javascriptsource.com/thumbnail-viewer.html  --&gt;

&lt;! &gt;
&lt;! &gt;

&lt;!-- Begin
function ViewImage(form) {
ix = form.width.value;
iy = form.height.value;
ifile = form.url.value;
NS = (document.layers) ? 1 : 0;
localurl = ifile.indexOf('http://') == -1;
if (NS && localurl) ifile = "file:///" + ifile;
var win;
var sWidth;
var sHeight;
win = window.open("","","width="+ix+",height="+iy+",menubar=no,toolbar=no,top=100,left=100");
if (NS) {
sWidth = win.innerWidth;
sHeight = win.innerHeight;
} else {
sWidth = win.document.body.clientWidth;
sHeight = win.document.body.clientHeight;
}
win.document.open();
win.document.write("&lt;html&gt;&lt;head&gt;&lt;/head&gt;&lt;body onBlur=this.close();&gt;");
win.document.write('&lt;div style="position:absolute;width:'+ix+'px;height:'+iy+'px;left:0px;top:0px"&gt;');
win.document.write("&lt;img src="+ifile+" width=" + ix + " height=" + iy + "&gt;&lt;/div&gt;&lt;/body&gt;&lt;/html&gt;");
win.document.close();
}
//  End --&gt;
&lt;/script&gt;
&lt;/HEAD&gt;

&lt;!-- STEP TWO: Copy this code into the BODY of your HTML document  --&gt;

&lt;BODY&gt;

&lt;center&gt;

&lt;pre&gt;
Type the web address (starting with http://) of the
image you would like to view, or browse your computer
for an image by clicking the &lt;b&gt;Browse...&lt;/b&gt; button.&lt;/b&gt;
&lt;/pre&gt;

&lt;p&gt;
&lt;form name=imageform&gt;
&lt;input name=url type=file size=40&gt;
&lt;p&gt;
Height: &lt;input name=height type=text value="200" size=3&gt;
Width:  &lt;input name=width type=text value="150" size=3&gt;
&lt;p&gt;
&lt;input type=button value="View Image" onClick="ViewImage(this.form);"&gt;


 

&lt;!-- Script Size:  2.07 KB --&gt;</textarea><br><font FACE="helvetica,arial,geneva"></font></td></tr>

</table>
</form>
</FONT>
</CENTER>


</center>
</body></html>